(function () {

  var style = `
    .task_record .jwebui-table{
      height: calc(100% - 30px);
    }
    .task_record td {
      white-space:nowrap;
      overflow:hidden;
      text-overflow: ellipsis;
    }
    .task_record table{
        table-layout:fixed;
        word-wrap:break-word;
    }
    .task_record{
      position: relative;
      height: 100%;
    }
    
    .task_record .layui-table{
      height: calc(100% - 30px);
      display: block;
      overflow: auto;
      margin: 0;
    }
    .task_record .news {
      color: rgb(255, 255, 255);
      background: rgb(239, 110, 0);
      padding: 0px 4px;
      transform: skew(-16deg);
      display: inline-block;
      height: 15px;
      line-height: 15px;
    }
  `;

  var template = `
   <div class="task_record">
    <jwebui-table :cols="recordCols" :data="records">
      <template v-slot:spider_title="slotProps">
        <div v-if="isNew(slotProps.data)" style=""><span class="news">New!</span>&nbsp;{{slotProps.data.spider_title}}</div>
      </template>
      <template v-slot:spider_status="slotProps">
       <span :style="'color:'+status[slotProps.data.spider_status].color + ';'">{{ status[slotProps.data.spider_status].title }}</span>
      </template>
      <template v-slot:spider_datetime="slotProps">
       <span>{{ slotProps.data.spider_datetime instanceof Date?slotProps.data.spider_datetime.Format('yyyy-MM-dd HH:mm:ss') : slotProps.data.spider_datetime }}</span>
      </template>
      <template v-slot:oper="slotProps">
          <a class="layui-btn layui-btn-xs" @click="openSource(slotProps.data)"  >来源</a>
          <a class="layui-btn layui-btn-xs" @click="openResult(slotProps.data)"  >采集结果</a>
      </template>
    </jwebui-table>
    <jwebui-page :page="page" @action="pageAction"></jwebui-page>
    <jwebui-model title="采集结果" :show="modelShow" @close="modelShow=false">
      <pre style="white-space: pre-wrap;" v-text="JSON.stringify(spiderResult, null, 4)" ></pre>
    </jwebui-model>
   </div>
  `

  return {
    data() {
      return {
        page: {
          currPage: 1,
          pageSize: 18,
          total: 0,
        },
        spiderResult: {},
        modelShow: false,
        status: {
          //0：未采集，1：正在采集，2：采集失败，3：采集成功
          '0': { title: '未采集', color: '#ccc' },
          '1': { title: '正在采集', color: '#99aa99' },
          '2': { title: '采集失败', color: '#aa6666' },
          '3': { title: '采集成功', color: '#ccc' },
        }
      }
    },
    props: ['task', 'refresh'],
    updated: () => {
    },
    mounted: () => {
    },
    computed: {
      recordCols() {
        var cols = [
          { title: '采集标题', key: 'spider_title', width: '*' },
          { title: '采集URL', key: 'spider_url', width: '*' },
          { title: '状态', key: 'spider_status', width: '80px' },
          { title: '采集时间', key: 'spider_datetime', width: '140px' },
          { title: '操作', key: 'oper', width: '160px' },
        ];
        // if(!this.task||!this.task.task_id) {
          cols.splice(2,0,{ title: '所属任务', key: 'task_name', width: '160px' });
        // }
        return cols;
      },
      records() {
        var records = this.loadRecords();
        for (let index = 0; index < records.length; index++) {
          const record = records[index];
          record.title = this.getTitle(record);
        }
        return records;
      },
    },
    watch: {
      task(val) {
        this.page.currPage = 1;
        this.page.total = 0;
      },
    },
    methods: {
      isNew(record) {
        if(record&&record.spider_datetime) {
          var time = record.spider_datetime;
          if(time instanceof Date) {
            time = time.Format("yyyy-MM-dd");
          } else {
            if(time){
              time = new Date(Date.parse(time))
              time = time.Format("yyyy-MM-dd")
            }
          }
          try {
            return (new Date()).Format("yyyy-MM-dd") == time;
          } catch (e) {
            console.log(e);
            return false;
          }
        }
        return false;
      },
      openSource(record) {
        if(record&&record.spider_url) {
          var win = new remote.BrowserWindow({
            width: 1200,
            height: 900,
            autoHideMenuBar : true,
          });
          win.loadURL(record.spider_url);
        }
      },
      openResult(record) {
        var spiderId = record.spider_id;
        var result = ipcRenderer.sendSync("getSpiderContent", spiderId);
        console.log("openResultcontent", result.data)
        this.spiderResult = JSON.parse(result.data);
        this.modelShow = true;
      },
      loadRecords() {
        var taskId = null;
        if (this.task && this.task.task_id) {
          taskId = this.task.task_id;
        }
        var result = ipcRenderer.sendSync("loadTaskSpiderRecords", { task_id: taskId, start: (this.page.currPage - 1) * this.page.pageSize, limit: this.page.pageSize, refresh: this.refresh });
        if (result.success) {
          this.page.total = result.total;
        }
        return result.data;
      },
      pageAction(num) {
        this.page.currPage = num;
      },
      getTitle(record) {
        if (record && record.spider_content) {
          var title = null;
          try {
            title = JSON.parse(record.spider_content).title
          } catch (e) {
          }
          return title;
        }
      }
    },
    template: template,
    style: style
  }
})()